<template>
  <div class="box">
     <p class="title">
      <img src="../../../assets/result_icon_succeed.png@2x.png" alt="">
      <span>购买成功</span>
    </p>
    <!-- <div class="swiper-container">
      <img :src="imgUrls" alt="">
    </div> -->
    <div class="color ft">
      {{productName}}
    </div>
    <!-- <div class="line">
      <span>点击</span>
      <span class="color" @click="goorderresult" v-if="productType=='1'">我的订单</span>
            <span class="color" @click="goorderresult" v-if="productType!='1'">我的券</span>
      <span>即可即使查询订单详情</span>
    </div> -->
     <div class="line">
      <span>点击</span>
      <span class="color" @click="goorderresult" >我的订单</span>
      <span>即可即使查询订单详情</span>
    </div>
     <div class="buttonbox fixed" ref="buttonbox" @click="gohome">
        回到首页
      </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      route:{},
      imgUrls:"",
      productName:"",
      productType:""
    };
  },
  computed:{
    imgUrl(){
      return this.$store._modules.root._children.a.state
    }
  },
   created() {
    // $router 直接监听无效，尚未查明，故作深拷贝处理
    this.route = Object.assign({}, this.$route);
    //此处应该发送请求
    this.imgUrls = this.route.query.imgurl;
    this.productName =this.route.query.productName
    this.productType =this.route.query.productType
    console.log(this.productType)
  },
  methods:{
    gohome(){
       this.$router.push({
          path:"/"
        })
    },
    goorderresult(){
        //   if(this.productType=="1"){
        //      this.$router.push({
        //        path:"/Myorder"
        //      })
        // }else{
        //       this.$router.push({
        //        path:"/Myvouchers"
        //      })
        // }
         this.$router.push({
               path:"/Myorder"
             })
    }
  },
   watch: {
    route() {
      if (this.route.path == "/payMoneyEnd") {

      }
    }
  }
}
</script>
<style lang="less" scoped>.box {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 40px;
    background-color:#f1f2f3;
     .ft{
      font-size: 19px;
      min-height: 30px;
      line-height: 22px;
    }
    .line{
      height: 3em;
      line-height: 3rem;
    }
    .color{
      color: #ED6E36;
    }
    .swiper-container {
       height:16rem;
      img{
        width: 91%;
        height: 90%;
        box-shadow: 0px 0px 10px gray;
        box-sizing: border-box;
        border-radius: 5px;
      }
    }
   .title {
      height: 5rem;
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      margin:0.5rem 0 0.5rem 0;
      img{
        height: 20px;
        margin-right: 0.7rem;
      }
      span{
        font-size: 20px;
        color: #ED6E36;
      }
    }
    .buttonbox {
        margin-top: 20px;
        margin-left: 4.5%;
        width: 91%;
        color: #fff;
        height: 40px;
        background-color: #ED6E36;
        line-height: 40px;
        border-radius: 5px;
        text-align: center;
    }
    .bgcolor {
        background-color: #E5E5E5;
    }
    .fixed {
        position: fixed;
        bottom: 30px;
        left: 0px;
    }
}

</style>


